<template>
  <div class="store-home-container" v-loading="boo.loading">
    <div class="home-desc flex-normal" v-if="baseData['endDay'] && baseData['endDay'] <= 45">
      <span class="desc-txt">您的店铺有效期截止日期为{{baseData['endTime'] || '--'}}，当前剩余时间为：{{baseData['endDay'] || '0'}}天，请及时续费，保持店铺正常使用</span>
      <span class="desc-btn" @click="jumpPages">立即续费</span>
    </div>
    <div class="home-content">
      <div class="content-label flex-normal">
        <span class="label-txt">今日数据</span>
      </div>
      <div class="store-main clearfix">
        <div class="store-item flex-column fl">
          <span class="item-label">今日下单（笔）</span>
          <span class="item-val">{{baseData['intradayOrderCount'] || '0'}}</span>
        </div>
        <div class="store-item flex-column fl">
          <span class="item-label">今日下单（金额）</span>
          <span class="item-val">{{baseData['intradayOrderMoney'] || '0.00'}}</span>
        </div>
        <div class="store-item flex-column fl">
          <span class="item-label">今日核销（笔）</span>
          <span class="item-val">{{baseData['intradayVerificationCount'] || '0'}}</span>
        </div>
        <div class="store-item flex-column fl">
          <span class="item-label">今日核销（金额）</span>
          <span class="item-val">{{baseData['intradayVerificationMoney'] || '0.00'}}</span>
        </div>
      </div>
      <div class="store-main clearfix">
        <div class="store-item flex-column fl">
          <span class="item-label">今日入账（笔）</span>
          <span class="item-val">{{baseData['intradaySettleAccountsOrderCount'] || '0'}}</span>
        </div>
        <div class="store-item flex-column fl">
          <span class="item-label">今日入账（金额）</span>
          <span class="item-val">{{baseData['intradaySettleAccountsOrderMoney'] || '0.00'}}</span>
        </div>
        <div class="store-item flex-column fl">
          <span class="item-label">今日服务费（元）</span>
          <span class="item-val">{{baseData['intradayServiceChargeMoney'] || '0.00'}}</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import {getHome} from '@/api/home/index'
export default {
  data() {
    return {
      boo: {
        loading: false,
      },
      baseData: {},
    };
  },
  mounted(){
    let _self = this
    _self.queryAdminHome()
  },
  methods: {
    queryAdminHome(){
      let _self = this
      _self.boo.loading = true
      getHome().then(res => {
        _self.baseData = res.data
      }).finally(() => _self.boo.loading = false)
    },
    jumpPages(){
      let _self = this
      _self.$router.push({name: 'shopPurchase'})
    },
  },
};
</script>

<style scoped lang="scss">
.store-home-container {
  margin-top: vh(10);
  .home-desc{
    height: vh(54);
    padding: 0 vw(30);
    background: rgba(18, 150, 219, 0.08);
    .desc-txt{
      color: #E2231A;
      font-size: vh(16);
    }
    .desc-btn{
      color: #0003AA;
      font-size: vh(16);
      margin-left: vw(30);
      cursor: pointer;
    }
  }
  .home-content{
    margin-top: vh(10);
    padding: 0 vw(30);
    .content-label{
      height: vh(54);
      margin-bottom: vh(30);
      .label-txt{
        color: #444;
        font-size: vh(20);
      }
    }
    .store-main{
      margin-bottom: vh(40);
      .store-item{
        width: vw(260);
        .item-label{
          font-size: vh(13);
          font-weight: 500;
          color: #666;
          margin-bottom: vh(10);
        }
        .item-val{
          font-size: vh(50);
          font-weight: bold;
          color: #333;
        }
      }
    }
  }
}
</style>

